import React, { Component } from 'react'
import {Switch,Route,Redirect,NavLink} from 'react-router-dom'
import ApproveM from './approveM'
import ApproveX from './approveX'
import Area from './area'
import Home from './home'
import MeetM from './meetM'
import MeetOrder from './meetOrder'
import MyOrder from './myOrder'
import OrderRoom from './orderRoom'
import System from './system'
import request from '../../util/request'
import {Button} from 'antd'
import isLogin from '../../util/isLogin';

class Main extends Component {
    state = {
        username:'',
        role_id:'',
        role_name:'',
        menuList:[]
    }
    componentDidMount(){
        let {username,role_id,role_name} = JSON.parse(localStorage.getItem('userInfo'));

        this.setState({
            username,
            role_id,
            role_name
        })

        request.get('/api/menuList',{role_id}).then(res => {
            console.log(res)
            if(res.code === 1){
                this.setState({
                    menuList:res.data
                })
            }
        })
    }
    render() {
        let {username,role_name,menuList} = this.state;
        return (
            <div className="wrap">
                <header className="header">
                    {username}-{role_name}
                    <Button onClick={this.exit}>退出</Button>
                </header>
                <div className="con">
                    <div className="left">
                        {menuList.map(item => <NavLink key={item.resource_route} to={'/main'+item.resource_route}>{item.resource_name}</NavLink>)}
                    </div>
                    <div className="right">
                        <Switch>
                            <Route path='/main/approveM' component={ApproveM}/>
                            <Route path='/main/approveX' component={ApproveX}/>
                            <Route path='/main/area' component={Area}/>
                            <Route path='/main/home' component={Home}/>
                            <Route path='/main/meetM' component={MeetM}/>
                            <Route path='/main/meetOrder' component={MeetOrder}/>
                            <Route path='/main/myOrder' component={MyOrder}/>
                            <Route path='/main/orderRoom' component={OrderRoom}/>
                            <Route path='/main/system' component={System}/>
                            <Redirect from="/main" to="/main/home"></Redirect>
                        </Switch>
                    </div>
                </div>
            </div>
        )
    }

    exit = () => {
        localStorage.clear();
        this.props.history.push('/login');
    }
}

export default isLogin(Main)
